<template>
    <h2>优惠券显示</h2>
    <span>名称</span>
    <input type="text" v-model="state.disname" >
    <span>开始时间</span>
    <input type="date" v-model="state.sdate" >
    <span>结束时间</span>
    <input type="date" v-model="state.edate">
    <input type="button" value="查询" @click="youhuiquan" >
    <table border="1">
        <thead>
            <tr>
        <td>优惠券类型</td>
        <td>优惠券名称</td>
        <td>门店</td>
        <td>限领人数</td>
        <td>使用条件</td>
        <td>减免金额</td>
        <td>折扣</td>
        <td>开始时间</td>
        <td>结束时间</td>
        <td>操作</td>
        </tr>
        </thead>
        <tbody>
        <tr v-for="item in list">
        <td>{{item.discounttypid }}</td>
        <td>{{item.discountname}}</td>
        <td>{{item.storeid}}</td>
        <td>{{item.xnum}}</td>
        <td>{{item.pmoney}}</td>
        <td>{{item.jmoney}}</td>
        <td>{{item.zhenko}}</td>
        <td>{{moment(item.stime).format("YYYY-MM-DD")}}</td>
        <td>{{item.etime.substr(0,10)}}</td>
        <td><input type="button" value="修改" @click="xiugai(item.id)" ></td>
            </tr>
        </tbody>
    </table>
    <input type="button" value="首页" @click="gopage('a')" >
    <input type="button" value="上一页" @click="gopage('b')" >
    <input type="button" value="下一页" @click="gopage('c')" >
    <input type="button" value="尾页" @click="gopage('d')" >
</template>

<script setup lang="ts">
import axios from 'axios';
import { reactive,toRefs,onMounted } from 'vue';
import { useRouter,useRoute } from 'vue-router';
import moment from 'moment';
const data:any = reactive({
    state:{
        disname:'',
        sdate:'',
        edate:'',
        pageindex:1,
        pagesize:2
    },
    list:[],
    totalcount:0,
    totalpage:0
})
const router = useRouter();
const route = useRoute();
onMounted(() => {
    youhuiquan();
})
const { state,list,totalcount,totalpage} = toRefs(data)

const youhuiquan = () => {
    // 获取优惠券信息
    axios({
        url:'/api/Discount/ShowDiscouunt',
        method:'get',
        params:state.value
    })
    .then(res=> {
        console.log(res);
        list.value = res.data.data;
        totalcount.value = res.data.totalcount;
        totalpage.value = res.data.totalpage;
    })
    .catch(err=> {
        console.log(err);
    })
}

//分页
const gopage=(str:any)=>{
    switch(str)
    {
        case 'a':
        
        if(state.value.pageindex=1)
        {
            alert('开始翻页');
            return;
        }
        state.value.pageindex=1;
        console.log('开始翻页');
            break;
            case 'b':
            console.log('上一页');
        if(state.value.pageindex<totalpage.value)
        {
            alert('已经是第一页');
            return;
        }
            state.value.pageindex--;
            break;
            case 'c':
            console.log('下一页');
            if(state.value.pageindex==totalpage.value)
        {
            alert('已经是最后一页');
            return;
        }
            state.value.pageindex++;
            break;
            case 'd':
            console.log('到达最后一页');
            if(state.value.pageindex==totalpage.value)
            {
                alert('到达最后一页');
                 return;
            }
            state.value.pageindex=totalpage.value;
            break;
    }
    youhuiquan();
}



//修改
const xiugai = (id:any) => {
    router.push({
    path:'/Memxiugai',
    query:{id:id}
    }) 
}
</script>